<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<style>
    *{
        margin: 0;
        padding: 0;
    }
    body{
        background:white;
    }
    .page_top{
        padding-bottom:20px;
    }
    .arrow{
        position:fixed;
        left: 10;
        top: 10;
    }
    .photo{
        position:fixed;
        right: 10;
        top: 10;
    }
    .photography{
        position: absolute;
        margin-top:0;
    }
    .username{
        color: white;
        position:fixed;
        right:70;
        top:230;
        font-weight: bold;
    }
    .usericon{
        position:fixed;
        right:10;
        top:225;
    }
    .usericon img{
        border-radius:5px;
    }
    .item{
        position:sticky;
        top: 0;
        background-color: #efefef;
    }
    .icon1{
        position:fixed;
        left:20;
        top:310;
    }
    .f_name1{
        font-weight: bold;
        color:rgb(77, 84, 182);
        position:fixed;
        left:90;
        top:310;
    }
    .text1{
        position:fixed;
        left:90;
        top:330;
    }
    .f_pic1{
        position:fixed;
        left:90;
        top:350;
    }
    .time1{
        font-size:8px;
        color:gray;
        position:fixed;
        left:90;
        top:550;
    }
    .more{
        background: #efefef;
        position:fixed;
        right:40;
        top:550;
        border-radius: 5px;
        width:25px;
        text-align:center;
    }
    .line{
        width: 100%;
        height: 1px;
        background:#747272;
        position: fixed;
        top:580;
    }
</style>

<div class="all">
    <div class="page_top">
        <!-- 相册封面 -->
        <div class="photography">
            <img src="背景.jpg" width="100%"/>
        </div>
        <!-- 相册封面 -->

        <!-- 页面跳转 -->
        <div class="item">
            <a href="fx.html">
                <img class="arrow" src="分页 - 上一页.png" width="17px"/>
            </a>
            <a href="">
                <img class="photo" src="相机.png" width="20px"/>
            </a>
        </div>
        <!-- 页面跳转 -->

        <!-- 用户信息 -->
        <div class="userinfo">
            <div class="username">《关于只要加个书名号就变成了轻小说这件事》</div>
            <div class="usericon">
                <a href="">
                    <img src="ZZ.jpg" width="60px"/>
                </a>
            </div>
        </div>
        <!-- 用户信息 -->
    </div>

    <div class="f_contents">
        <!--内容 -->
        <div class="f1_content">
            <div class="friendicons">
                <div class="icon1">
                    <a href="">
                        <img src="2.png" width="50px"/>
                    </a>
                </div>
                <div class="f_name1">高圆圆</div>
                <div class="f_content1">
                    <div class="text1">喵内噶？</div>
                    <div class="f_pic1">
                        <img src="喵内2.jpg" width="200px"/>
                    </div>
                </div>
                <div class="time1">1小时前</div>
                <div class="more">
                    <img src="更多.png" width="15px"/>
                </div>
            </div>
            <div class="line"></div>
        </div>
        <!--内容 -->
    </div>
</div>
<br/>